<template>
  <div :class="$style.wrap">
    <ContentWrap>
      <Query ref="query" allege-handle @on-query="queryHandle"></Query>
      <div class="button-container" style="padding-top: 0">
        <Button type="primary" @click="allegeScoreHandle">申诉评分</Button>
      </div>
      <table-box ref="table" no-request :table-config="tableConfig" :other-filters="otherFilters" :other-raw="otherRaw" :selected-arry.sync="selectionList" @selection-change="selectionChangeHandle">
        <el-table-column slot="before" type="index" align="center" label="序号" width="50"></el-table-column>
      </table-box>
    </ContentWrap>
  </div>
</template>
<script>
import ContentWrap from '@/components/ContentWrap'
import Query from '../components/query'
import { allegeStateList, smileStateList, lelveList, modelList } from '../../common'
export default {
  name: 'TaskAllege',
  components: {
    ContentWrap,
    Query
  },
  data() {
    return {
      tableConfig: {
        interfacePath: '/call-center/api/v1/qualityCheckTask/page',
        hideFuncBar: true,
        sort: 'createTime',
        order: 'desc',
        setting: [
          {
            prop: 'projectName',
            label: '项目名称',
            minWidth: 120
          },
          {
            prop: 'taskCode',
            label: '任务编码',
            minWidth: 145,
            className: 'table-click-text',
            isButton: true,
            clickFun: v => {
              const handle = ['1', 1].includes(v.appealState)
              const title = handle ? '质检评分结果' : '申诉质检评分结果'
              const query = !handle ? { allege: 1 } : {}
              this.$router.push({ name: 'PreviewEvalScore', params: { id: v.id, title }, query })
            }
          },
          {
            prop: 'appealState',
            label: '申诉处理状态',
            minWidth: 120,
            formatData: v => {
              return this.$getNameByDataDict(v.appealState, allegeStateList)
            }
          },
          {
            prop: 'score',
            label: '质检得分',
            minWidth: 100
          },
          {
            prop: 'appealScore',
            label: '申诉得分',
            minWidth: 100
          },
          {
            prop: 'appealIsSmile',
            label: '是否微笑服务',
            minWidth: 120,
            formatData: v => {
              return this.$getNameByDataDict(v.appealIsSmile, smileStateList)
            }
          },
          {
            prop: 'appealLevel',
            label: '等级',
            minWidth: 120,
            formatData: v => {
              return this.$getNameByDataDict(v.appealLevel, lelveList)
            }
          },
          {
            prop: 'appealTypicalType',
            label: '标记典型',
            minWidth: 120,
            formatData: v => {
              return this.$getNameByDataDict(v.appealTypicalType, modelList)
            }
          }
        ]
      },
      otherFilters: [],
      otherRaw: {},
      selectionList: []
    }
  },
  beforeRouteEnter(to, from, next) {
    next(vm => {
      if (from.name === 'AllegeEvalScore') {
        vm.refreshTable('onPage')
      }
    })
  },
  methods: {
    queryHandle(otherFilters) {
      this.otherFilters = otherFilters
      this.refreshTable()
    },
    selectionChangeHandle(v) {
      this.selectionList = v
    },
    // 刷新列表
    refreshTable(type) {
      this.$nextTick(() => {
        this.$refs.table.initTableData(type)
      })
    },
    // 申诉
    allegeScoreHandle() {
      return this.$checkSelected(this.selectionList).then(() => {
        const d = this.selectionList[0]
        const id = d.id
        // if ([1, '1'].includes(d.appealState)) {
        //   this.$message.warning('申诉已经处理！')
        //   return
        // }
        this.$router.push({ name: 'AllegeEvalScore', params: { id }})
      })
    }
  }
}
</script>
<style lang='scss' module>
.warp{

}
</style>
